
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, shrink-to-fit=no">
    <title>播放器例子-封面</title>
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="msapplication-tap-highlight" content="no">
    <style>
        body {
            margin: 0;
            padding: 0;
        }
    </style>
</head>
<body>
<div id="video-container" style="margin: 0px auto;">

</div>
<script src="//imgcache.qq.com/open/qcloud/video/vcplayer/TcPlayer-2.3.2.js"></script>
<script>
        /**
         * 视频类型播放优先级
         * mobile ：m3u8>mp4
         * PC ：RTMP>flv>m3u8>mp4
         */

        /**
         * 属性说明：
         *
         * coverpic  {Object|String} src:图片地址，style：default 居中1:1显示 stretch 拉伸铺满，图片可能会变形 cover 等比横向铺满，图片某些部分可能无法显示在区域内
         *  封面在 ios10 暂时无法生效。
         */
        var options = {
            m3u8: 'https://mobilelive-play.ysp.cctv.cn/ysp/A5B479A74C368A166A416C69942E99F00AF351D30394DF7FF6FC13A487516435F788BDE8CC288E903A35A676D68FF3B7B76F0C26498B9E66C39D33A68E35D8B8AAD3AD7696BBA6BEE2A7ECA56441E496FB5BE8FCA564514A5783776BC9C9118F/2001893301_hd.m3u8',
            coverpic: coverpic || {
                style: 'cover',
                src: '//vodplayerinfo-10005041.file.myqcloud.com/3035579109/vod_paster_pause/paster_pause1469013308.jpg'
            },
            autoplay: autoplay ? true : false,
            live: live,
            width: width || '480',
            height: height || '320'
        };

        var player = new TcPlayer('video-container', options);
        window.qcplayer = player;


</script>
</body>
</html>
